<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title>日程管理</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <link rel="stylesheet" href="./res/layui/css/layui.css" tppabs="./res/layui/css/layui.css" media="all">
  <style type="text/css">
    table {
      table-layout: fixed;
    }

    td {
      word-break: break-all;
      word-wrap: break-word;
    }
  </style>
</head>
<!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
</head>


<body background="./res/bg.jpg"
  style="background-attachment: fixed;background-repeat: no-repeat;background-size: 100% 100%; opacity: 0.8;">
  <!-- style="background: rgba(0, 0, 0, 0) url(./res/bg.jpg) repeat scroll left top / 100%; margin: 0px; padding: 0px; height: 100%; opacity: 0.8;"> -->
    <div class="layui-container">
      <div class="layui-tab layui-tab-brief" lay-filter="test1">
        <ul class="layui-tab-title">
          <li class="layui-this" id="tab1" lay-id="1">
            <b><div id="head_time">2022-3-23-Monday</div></b>
          </li>
          <li lay-id="2" id="tab2" ><b>History</b></li>
          <li lay-id="3" id="tab3"><b>Class</b></li>
        </ul>
        <div class="layui-tab-content">
          <div class="layui-tab-item layui-show">
            <div id="task_view">
              <div class="layui-row layui-col-space15">
                <div class="layui-col-md12">
                  <div class="layui-card layui-col-md12">
                    <div class="layui-card-header layui-bg-green ">卡片面板
                      <div class="layui-layout-right">
                        <a style="color:white" href="./index.html">
                          <i class="layui-icon layui-icon-edit"></i>&nbsp;New&nbsp;&nbsp;&nbsp;</a>
                      </div>
                    </div>
                    <div class="layui-card-body">
                      <table class="layui-table" lay-size="sm">
                        <colgroup>
                          <col width="110px">
                          <col width="110px">
                          <col>
                          <col width="110px">
                        </colgroup>
                        <thead>
                          <tr>
                            <th>Start</th>
                            <th>End</th>
                            <th>Content</th>
                            <th>Operation</th>
                          </tr>
                        </thead>
                        <tbody>
                          <tr>
                            <td>2016-11-29 10:20</td>
                            <td>2016-11-29 10:20</td>
                            <td>人生就像是一场修行</td>
                            <td>
                              <div class="layui-btn-group">
                                <button type="button" class="layui-btn layui-btn-sm">
                                  <i class="layui-icon">&#xe605;</i>
                                </button>
                                <button type="button" class="layui-btn layui-btn-sm">
                                  <i class="layui-icon">&#xe640;</i>
                                </button>
                              </div>
                            </td>
                          </tr>
                          <tr>
                            <td>2016-11-29 10:20</td>
                            <td>2016-11-29 10:20</td>
                            <td>人生就像是一场修行</td>
                            <td>
                              <div class="layui-btn-group">
                                <button type="button" class="layui-btn layui-btn-sm">
                                  <i class="layui-icon">&#xe605;</i>
                                </button>
                                <button type="button" class="layui-btn layui-btn-sm">
                                  <i class="layui-icon">&#xe640;</i>
                                </button>
                              </div>
                            </td>
                          </tr>
                        </tbody>
                      </table>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <script id="tasks" type="text/html">
                {{# 
                   for(var i in d.class)
                    {
                      if(d.class[i].status<=0) continue;
                }}
                <div class="layui-row layui-col-space15">
                <div class="layui-col-md12">
                  <div class="layui-card layui-col-md12">
                    <div class="layui-card-header layui-bg-green ">
                      <span class="layui-badge-dot layui-bg-orange"></span>
                      {{d.class[i].class_name}}
                      <div class="layui-layout-right">
                        <a style="color:white" href="javascript:addTask('{{d.class[i].class_name}}',{{d.class[i].class_id}})">
                          <i class="layui-icon layui-icon-edit"></i>&nbsp;New&nbsp;&nbsp;&nbsp;</a>
                      </div>
                    </div>
                    <div class="layui-card-body">
                      <table class="layui-table" lay-size="sm">
                        <colgroup>
                          <col  width="110px">
                            <col width="110px">
                              <col  >
                                <col width="110px" >
                                </colgroup>
                                <thead>
                                  <tr>
                                    <th>Start</th>
                                    <th>End</th>
                                    <th>Content</th>
                                    <th>Operation</th>
                                  </tr>
                                </thead>
                                <tbody>
                                  {{#   
                                  var curTask=d.task[d.class[i].class_id];
                                  for(var j in curTask){
                                  }}
                                  <tr>
                                    <td>{{curTask[j].task_startTime}}</td>
                                    <td>{{curTask[j].task_deadline}}</td>
                                    <td>{{curTask[j].task_content}}</td>
                                    <td>
                                      <div class="layui-btn-group">
                                        <button type="button" class="layui-btn layui-btn-sm" onclick="update_info('task','{{curTask[j].task_id}}','is_finished','1')">
                                          <i class="layui-icon">&#xe605;</i>
                                        </button>
                                        <button type="button" class="layui-btn layui-btn-sm"  onclick="top_this('task','{{curTask[j].task_id}}')">
                                          <i class="layui-icon">&#xe604;</i>
                                        </button>
                                      </div>
                                    </td>
                                  </tr>
                                  {{#       
                                  
                                    }
                                  
                                  }}
                                </tbody>
                              </table>
                            </div>
                          </div>
                        </div>
                    </div>
                  </div>
                    {{# 
                      }
                    }}
              </script>

            <script id="tasks_phone" type="text/html">
            {{#
            for(var i in d.class)
            {
              if(d.class[i].status<=0) continue;
            }}
            <div class="layui-row layui-col-space15">
              <div class="layui-col-md12">
                <div class="layui-card layui-col-md12">
                  <div class="layui-card-header layui-bg-green ">
                    <span class="layui-badge-dot layui-bg-orange"></span>
                    {{d.class[i].class_name}}
                    <div class="layui-layout-right">
                      <a style="color:white"
                        href="javascript:addTask('{{d.class[i].class_name}}',{{d.class[i].class_id}})">
                        <i class="layui-icon layui-icon-edit"></i>&nbsp;New&nbsp;&nbsp;&nbsp;</a>
                    </div>
                  </div>
                  <div class="layui-card-body">

                    {{#
                    var curTask=d.task[d.class[i].class_id];
                    for(var j in curTask){
                    }}
                    <table class="layui-table" lay-size="sm">
                      <colgroup>
                        <col>
                      </colgroup>
                      <tbody>
                        <tr>
                          <td>{{curTask[j].task_content}}</td>
                        </tr>
                        <tr>
                          <td>
                            
                            <div style="float:right;">
                              <span>
                                <b>
                                   From {{curTask[j].task_startTime}} To {{curTask[j].task_deadline}}
                                </b>
                              </span>
                            </div>
                            <div style="float:left;">
                              <span class="layui-badge layui-bg-green" onclick="update_info('task','{{curTask[j].task_id}}','is_finished','1')">
                               Done
                              </span>
                              <span class="layui-badge layui-bg-green"  onclick="top_this('task','{{curTask[j].task_id}}')">
                                Top
                              </span>
                            <div>
                            
                          </td>
                        </tr>
                      </tbody>
                    </table>
                    {{#

                    }

                    }}
                  </div>
                </div>
              </div>
            </div>
          </div>
          {{#
          }
          }}
          </script>

          </div>

          <div class="layui-tab-item">

            <div class="layui-col-md12">
              <div class="layui-card layui-col-md12">
                <div class="layui-card-header layui-bg-green ">
                  <span class="layui-badge-dot layui-bg-orange"></span>
                  History Items
                </div>
                <div class="layui-card-body">
                  <div id="history_view">
                    <table class="layui-table" lay-size="sm">
                      <colgroup>
                        <col width="110px">
                        <col width="110px">
                        <col width="110px">
                        <col>
                        <col width="110px">
                        <col width="110px">
                      </colgroup>
                      <thead>
                        <tr>
                          <th>Start</th>
                          <th>End</th>
                          <th>Class</th>
                          <th>Content</th>
                          <th>Status</th>
                          <th>Operation</th>
                        </tr>
                      </thead>
                      <tbody>
                        <tr>
                          <td>2016-11-29 10:20</td>
                          <td>2016-11-29 10:20</td>
                          <td>科研</td>
                          <td>人生就像是一场修行</td>
                          <td>undone</td>
                          <td>
                            <div class="layui-btn-group">
                              <button type="button" class="layui-btn layui-btn-sm">
                                <i class="layui-icon">&#x1007;</i>
                              </button>
                              <button type="button" class="layui-btn layui-btn-sm">
                                <i class="layui-icon">&#xe640;</i>
                              </button>
                            </div>
                          </td>
                        </tr>
                      </tbody>
                    </table>
                  </div>
                  <div id="pages"></div>
                </div>
              </div>
            </div>



          </div>
          <div class="layui-tab-item">
            <div class="layui-col-md12">
              <div class="layui-card layui-col-md12">
                <div class="layui-card-header layui-bg-green ">
                  <span class="layui-badge-dot layui-bg-orange"></span>
                  Class Settings
                  <div class="layui-layout-right">
                    <a style="color:white" href="javascript:addClass()">
                      <i class="layui-icon layui-icon-edit"></i>&nbsp;New&nbsp;&nbsp;&nbsp;</a>
                  </div>
                </div>
                <div class="layui-card-body">
                  <table class="layui-table" lay-size="sm">
                    <colgroup>
                      <col width="60px">
                      <col>
                      <col width="150px">
                    </colgroup>
                    <thead>
                      <tr>
                        <th>Status</th>
                        <th>Class Name</th>
                        <th>Operation</th>
                      </tr>
                    </thead>
                    <tbody id="class_view">
                      <tr>
                        <td>Show</td>
                        <td>人生就像是一场修行</td>
                        <td>
                          <div class="layui-btn-group">
                            <button type="button" class="layui-btn layui-btn-sm">
                              <i class="layui-icon">&#x1007;</i>
                            </button>
                            <button type="button" class="layui-btn layui-btn-sm">
                              <i class="layui-icon">&#xe640;</i>
                            </button>
                          </div>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </div>
              </div>
            </div>

          </div>
        </div>
      </div>
  </b>

  <script id="history_items" type="text/html">
  <table class="layui-table" lay-size="sm">
  <colgroup>
    <col width="110px">
    <col width="110px">
    <col width="110px">
    <col>
    <col width="110px">
    <col width="110px">
  </colgroup>
  <thead>
    <tr>
      <th>Start</th>
      <th>End</th>
      <th>Class</th>
      <th>Content</th>
      <th>Status</th>
      <th>Operation</th>
    </tr>
  </thead>
  <tbody>
    {{#
    for(var i in d){
    }}
    <tr>
      <td>{{d[i].task_startTime}}</td>
      <td>{{d[i].task_deadline}}</td>
      <td>{{d[i].class_name}}</td>
      <td>{{d[i].task_content}}</td>
      <td>
        {{# if(d[i].is_finished=="0"){ }}
        {{"undone"}}
        {{# } else { }}
        {{"done"}}
        {{# } }}
      </td>
      <td>
        <div class="layui-btn-group">
          <button type="button" class="layui-btn layui-btn-sm" onclick="update_info('task','{{d[i].task_id}}','is_finished','0')">
            <i class="layui-icon">&#x1007;</i>
          </button>
          <button type="button" class="layui-btn layui-btn-sm" onclick="update_info('task','{{d[i].task_id}}','is_finished','-1')">
            <i class="layui-icon">&#xe640;</i>
          </button>
        </div>
      </td>
    </tr>

    {{#
    }
    }}
  </tbody>
  </table>
  </script>

  <script id="history_items_phone" type="text/html">

  {{#
  for(var i in d){
  }}
  <table class="layui-table" lay-size="sm">
    <colgroup>
      <col>
    </colgroup>
    <tbody>
      <tr>
        <td>
          <div style="float:right;">
            <span>
              {{# if(d[i].is_finished=="0"){ }}
              <span class="layui-badge-dot layui-bg-orange"></span>
              {{"undo"}}
              {{# } else { }}
              <span class="layui-badge-dot layui-bg-green"></span>
              {{"done"}}
              {{# } }}
            </span>
          </div>
          <div style="float:left;">
            <span class="layui-badge layui-bg-green">
             <b>{{d[i].class_name}}</b>
            </span>
            <div>

        </td>
      </tr>
      <tr>
        <td>{{d[i].task_content}}</td>
      </tr>
      <tr>
        <td>
          <div style="float:right;">
            <span>
              <b>
                From {{d[i].task_startTime}} To {{d[i].task_deadline}}
              </b>
            </span>
          </div>
          <div style="float:left;">
            <span class="layui-badge layui-bg-green" onclick="update_info('task','{{d[i].task_id}}','is_finished','0')">
              Recover
            </span>
            <span class="layui-badge layui-bg-green" onclick="update_info('task','{{d[i].task_id}}','is_finished','-1')">
              Delete
            </span>
          <div>
        </td>
      </tr>
    </tbody>
  </table>
  {{#
  }
  }}

  </script>


  <script id="class_items" type="text/html">
    {{#
      for(var i in d){
        if(d[i].status=="-1") continue;
    }}
  <tr>
    <td>
    {{# if(d[i].status=="1"){   }}
      {{"Show"}}
    {{# } else { }}
      {{"Hidden"}}
    {{#  }  }}
    </td>
    <td>{{d[i].class_name}}</td>
    <td>
      <div class="layui-btn-group">
        {{# if(d[i].status=="1"){   }}
          <button type="button" class="layui-btn layui-btn-sm" onclick="update_info('class','{{d[i].class_id}}','status','0')">
            <i class="layui-icon">&#x1007;</i>
          </button>
        {{# } else { }}
          <button type="button" class="layui-btn layui-btn-sm" onclick="update_info('class','{{d[i].class_id}}','status','1')">
            <i class="layui-icon">&#x1005;</i>
          </button>
        {{#  }  }}
        
        <button type="button" class="layui-btn layui-btn-sm" onclick="update_info('class','{{d[i].class_id}}','status','-1')">
          <i class="layui-icon">&#xe640;</i>
        </button>
        <button type="button" class="layui-btn layui-btn-sm"  onclick="top_this('class','{{d[i].class_id}}')">
          <i class="layui-icon">&#xe604;</i>
        </button>
      </div>
    </td>
  </tr>
  {{#
  }
  }}
  </script>

  <script type="text/html" id="addTaskForm">
    <b>
    <div style="padding:10px;">
      <form lay-filter='addTask' class="layui-form" action="">
        <input type="text" name="task_class" class="layui-hide" placeholder="Id" autocomplete="off" value="{{d.class_id}}">
        <input type="text" name="is_finished" class="layui-hide" placeholder="Id" autocomplete="off" value="0">
        <table class="layui-table" style="text-align: center;" lay-size="sm">
          <colgroup>
            <col width="20%">
            <col width="80%">
          </colgroup>
          <tbody>
            <tr>
              <td>Class</td>
              <td><input type="text"  value="{{d.class_name}}"  name="task_startTime" placeholder="start time" autocomplete="off" class="layui-input" disabled></td>
            </tr>
            <tr>
              <td>Start</td>
              <td><input type="text"  id="task_startTime" name="task_startTime" placeholder="start time" autocomplete="off" class="layui-input"></td>
            </tr>
            <tr>
              <td>End</td>
              <td><input type="text" id="task_deadline"  name="task_deadline" placeholder="deadline" autocomplete="off" class="layui-input"></td>
            </tr>
            <tr>
              <td>Content</td>
              <td class="td-height" height="100px"><textarea type="text" name="task_content" placeholder="content" autocomplete="off" class="layui-textarea"> </textarea></td>
            </tr>
          </tbody>
        </table>
        <button type="button" lay-submit lay-filter="saveNewTask" class="layui-btn layui-btn-fluid">保存</button>
      </form>
    </div>
</script>

  <script type="text/html" id="addClassForm">
  <b>
  <div style="padding:10px;">
    <form lay-filter='addClass' class="layui-form" action="">
      <input type="text" name="status" class="layui-hide" placeholder="Id" autocomplete="off" value="1">
      <table class="layui-table" style="text-align: center;" lay-size="sm">
        <colgroup>
          <col width="20%">
          <col width="80%">
        </colgroup>
        <tbody>
          <tr>
            <td>Class Name</td>
            <td><input type="text"  name="class_name" placeholder="class name" autocomplete="off" class="layui-input"></td>
          </tr>
          <tr>
        </tbody>
      </table>
      <button type="button" lay-submit lay-filter="saveNewClass" class="layui-btn layui-btn-fluid">保存</button>
    </form>
  </div>
  </b>
</script>



  <script src="./res/layui/layui.js" charset="utf-8"></script>
  <!-- 注意：如果你直接复制所有代码到本地，上述 JS 路径需要改成你本地的 -->
  <script src="./res/index.js" charset="utf-8"></script>

</body>

</html>